﻿@model Vms.Web.Models.SCREEN_BRIGHTNESS
@{List<SelectListItem> handleLight = (List<SelectListItem>)ViewBag.handleLight; }
@{List<SelectListItem> adjustType = (List<SelectListItem>)ViewBag.adjustType; }
@{List<SelectListItem> hours = (List<SelectListItem>)ViewBag.hours; }
@{List<SelectListItem> minutes = (List<SelectListItem>)ViewBag.minutes; }
<script src="~/Scripts/jquery-1.7.1.min.js"></script>
<style>
    .timestamp
    {
        font-weight: bold;
    }
    .time-box
    {
        text-align: center;
        float: left;
        margin-right: 12px;
    }
    #nHour1, #nMinute1, #nLight1, #nHour2, #nMinute2, #nLight2
    {
        width: 65px;
    }
    
    #nHandleLight
    {
        width: 220px;
    }
    legen
    {
        font-size: large;
        text-align: left;
    }
    legend span
    {
        color: Blue;
        font-style: italic;
    }
    fieldset
    {
        width: 60%;
        margin: 0 auto;
    }
    #container
    {
        width: 50%;
        margin: 0px auto;
    }
</style>
<script type="text/javascript">
    $(document).ready(function () {
        var selected = $('#drop > option:selected').val();
        if (selected == 0) { $('#time-wraper').hide(); }
        else {
            $('#auto-brightness').hide(600);
        }
        $('#drop').change(function () {
            $('#drop > option:selected').each(function () {
                var selected = $(this).val();
                if (selected == 1) 
                {
                    $('#time-wraper').show(600);
                    $('#auto-brightness').hide(600);
                }
                else {
                    $('#time-wraper').hide(600);
                    $('#auto-brightness').show(600);
                }
            })
        });
    });
</script>
@using (Html.BeginForm("EditBrightness", "Screens", FormMethod.Post, new { @class = "form-horizontal well" }))
{
    @Html.ValidationSummary(true)
    <fieldset>
        <legend>Screen brightness' adjustment for screen : <span>@ViewBag.screen_name</span>
        </legend>
        @Html.HiddenFor(model => model.Id)
        <div id="container">
            <div class="timestamp">
                <th>
                    Adjust Type
                </th>
            </div>
            <br />
            <div class="editor-field">
                @Html.DropDownListFor(model => model.nAdjustType, adjustType, new { id = "drop" })
            </div>
           
             <div id ="auto-brightness">
              <br />
            <div class="timestamp">
                Brightness
            </div>
            <br />
            <div class="editor-field">
                @Html.DropDownListFor(model => model.nHandleLight, handleLight)
                @Html.ValidationMessageFor(model => model.nHandleLight)
            </div>
            </div>
            <br />
            <div id="time-wraper">
                <p class="timestamp">
                </p>
                <div class="time-block">
                    <div class="time-box">
                        <div class="timestamp">
                            Hour
                        </div>
                        <div class="editor-field">
                            @Html.DropDownListFor(model => model.nHour1, hours)
                            @Html.ValidationMessageFor(model => model.nHour1)
                        </div>
                    </div>
                    <div class="time-box">
                        <div class="timestamp">
                            Minute
                        </div>
                        <div class="editor-field">
                            @Html.DropDownListFor(model => model.nMinute1, minutes)
                            @Html.ValidationMessageFor(model => model.nMinute1)
                        </div>
                    </div>
                    <div class="timestamp">
                        Brightness
                    </div>
                    <div class="editor-field">
                        @Html.DropDownListFor(model => model.nLight1, handleLight)
                        @Html.ValidationMessageFor(model => model.nLight1)
                    </div>
                </div>
                <br />
                <p class="timestamp">
                </p>
                <div class="time-block">
                    <div class="time-box">
                        <div class="timestamp">
                            Hour
                        </div>
                        <div class="editor-field">
                            @Html.DropDownListFor(model => model.nHour2, hours)
                            @Html.ValidationMessageFor(model => model.nHour2)
                        </div>
                    </div>
                    <div class="time-box">
                        <div class="timestamp">
                            Minute
                        </div>
                        <div class="editor-field">
                            @Html.DropDownListFor(model => model.nMinute2, minutes)
                            @Html.ValidationMessageFor(model => model.nMinute2)
                        </div>
                    </div>
                    <div class="timestamp">
                        Brightness
                    </div>
                    <div class="editor-field">
                        @Html.DropDownListFor(model => model.nLight2, handleLight)
                        @Html.ValidationMessageFor(model => model.nLight2)
                    </div>
                </div>
                <br />
                <p>
                </p>
            </div> 
                  
                    <!--end time wraper-->
            @Html.CheckBox("ApplyForAll", false) Apply for all
        </div>
        <div class="form-actions">
            <input type="submit" class="btn btn-primary" value="Save changes" />
            @Html.ActionLink("Cancel", "BrightnessControl", null, new { @class = "btn btn-warning" })
        </div>
    </fieldset>
}
